<template>
	<view>
		
		<view class="item">
		
			<view style="display: inline-flex; height: 80rpx; justify-content: space-between; margin: 0 20rpx;">
				<u-icon name="order" color="#1573FF" label="车辆订单信息" label-color="#333333"
					:customStyle="{'line-height': '80rpx',}">
				</u-icon>
		
				<text style="line-height: 80rpx; color: #1573FF;" @click="goRecord">减免记录</text>
			</view>
		
		
			<u-line color="#efefef" :customStyle="{'margin-bottom': '30rpx','display': 'block',}"></u-line>
		
			<view class="text-line">
				<text class="text-name">车辆订单号:</text>
				<text class="text-value">{{model.orderCarNo|filterNull}}</text>
		
				<text
					style="align-self: flex-end;color: white;font-size: 22rpx;padding: 5rpx 10rpx;background-color: #FFC500;border-radius: 50rpx 0 0 50rpx;"
					:style="{'background-color':1==model.customerType?'#1573FF':'#FFC500'}">{{1==model.customerType?'企业':2==model.customerType?'个人':''}}</text>
		
			</view>
		
			<view class="text-line">
				<text class="text-name">租赁类型:</text>
				<text class="text-value">{{model.rentTypeShow|filterNull}}</text>
			</view>
		
			<view class="text-line">
				<text class="text-name">客户名称:</text>
				<text class="text-value">{{model.customerName|filterNull}}</text>
			</view>
		
			<view class="text-line" @click="makecall(model.customerTel)">
				<text class="text-name">联系电话:</text>
				<text class="text-value" style="flex-grow: unset;">{{model.customerTel|filterNull}}</text>
				<image style="width: 30rpx;height: 30rpx;margin-left: 10rpx;" src="../../static/common/callPhone.png"
					mode="scaleToFill"></image>
		
			</view>
		
			<view class="text-line">
				<text class="text-name">出租方:</text>
				<text class="text-value">{{model.lessorName|filterNull}}</text>
			</view>
		
			<view class="text-line">
				<text class="text-name">品牌/车系/车型:</text>
				<text class="text-value">{{model.brandSeriesModel|filterNull}}</text>
			</view>
		
			<view class="text-line" v-if="1==model.rentType||2==model.rentType||3==model.rentType||4==model.rentType||5==model.rentType">
				<text class="text-name">租赁时间:</text>
				<text class="text-value">{{model.timeStartRent|filterNull}}至{{model.timeFinishRent|filterNull}}</text>
			</view>
		
			<view class="text-line">
				<text class="text-name">{{2==model.rentType?'整备费':5==model.rentType?'首付款/元/台':
				1==model.rentType||3==model.rentType||4==model.rentType?'保证金/元/台':'总单价'}}:</text>
				<text class="text-value">￥{{(2==model.rentType?model.servicingFee:5==model.rentType?model.downPayment:
				1==model.rentType||3==model.rentType||4==model.rentType?model.cashDeposit:model.totalPrice)|filterNull}}</text>
			</view>
		
			<view class="text-line" v-if="1==model.rentType||2==model.rentType||3==model.rentType||4==model.rentType||5==model.rentType">
				<text class="text-name">月租/元/台:</text>
				<text class="text-value">￥{{model.monthlyRent|filterNull}}</text>
			</view>
		
		</view>
		
		<view class="item" style="padding: 20rpx 30rpx 0;">
		
			<u-form :model="addbean" ref="uform" label-width="auto">
				
				<u-form-item label="减免金额/元" required borderBottom>
					<u-input v-model="addbean.creditAmount" type="digit" inputAlign="right" border="none" placeholder="请输入减免金额"></u-input>
				</u-form-item>
		
				<u-form-item label="减免原因" required borderBottom>
					<u-input v-model="addbean.reliefReason" inputAlign="right" placeholder="请输入减免原因" border="none"></u-input>
				</u-form-item>
		
				
				<view style="display: flex;flex-direction: column;">
					<u-form-item label="订单附件">
						<!-- <view class="car-photo" style="padding: 20rpx 0; display: block;font-size: 30rpx;color: #333;">订单附件</view> -->
					</u-form-item>
					
					<lr-upload ref="upload1" tag="1" @on-change="uploadOnChange"></lr-upload>
				</view>
				
			</u-form>
			
		</view>
		
		
		<view style="height: 100rpx;"></view>
		
		<view class="button-container">
			<button class="btn-item" @click="commit">提交申请</button>
		</view>
		
		
	</view>
</template>

<script>
	import lrUpload from '@/components/global/lr-upload.vue'
	export default {
		components: {
			lrUpload,
		},
		data() {
			return {
				model:{},
				addbean:{
					creditAmount:'',
					reliefReason:'',
					accessoryList:[],
					orderCarId:''
				},
				orderCarId:'',
				orderCarNo:''
			}
		},
		methods: {
			getData(){
				this.$u.api.costReliefDetail({
					orderCarNo:this.orderCarNo
				}).then(res=>{
					this.model = res
				})
			},
			
			//图片上传成功回调
			uploadOnChange(tag, resultList, resultObjList) {
				console.log(tag, resultList, resultObjList);
				switch (tag) {
					case '1': //订单附件
						this.addbean.accessoryList = resultList;
						break
				}
			},
			
			commit(){
				let that = this
				
				that.addbean.orderCarId = that.orderCarId
				
				
				if(uni.$u.test.isEmpty(this.addbean.creditAmount)){
					this.$u.toast('请输入减免金额')
					return
				}
				
				if(uni.$u.test.isEmpty(this.addbean.reliefReason)){
					this.$u.toast('请输入减免原因')
					return
				}
				
				uni.showModal({
					title:'确定提交吗?',
					success:(res)=>{
						if(res.confirm){
							that.$u.api.addCostRelief(that.addbean).then(res=>{
								that.$u.toast('提交成功')
								setTimeout(()=>{
									uni.navigateBack()
								}, 1000)
							})
						}
					}
				})
			},
			
			makecall(phone) {
				if (!uni.$u.test.isEmpty(phone)) {
					uni.makePhoneCall({
						phoneNumber: phone
					})
				}
			},
			
			goRecord(){
				if(uni.$u.test.isEmpty(this.model)){
					return
				}
				
				uni.navigateTo({
					url:'/pagesB/costrelief/costrelief-record?rentType='+this.model.rentType+'&orderCarNo='+this.orderCarNo
				})
			},
		},
		onLoad(op) {
			this.orderCarNo = 'null'!=op.orderCarNo?op.orderCarNo:''
			this.orderCarId = 'null'!=op.orderCarId?op.orderCarId:''
			
			this.getData()
		}
	}
</script>

<style>

</style>
